<template>
  <el-drawer
    title="新增组织结构"
    :visible="drawer"
    @close="close"
    size='50%'
    direction="rtl">
    <el-card style="margin: 10px;">
      <el-form :model="typeInfo" ref="typeInfoForm">
        <el-form-item>
          项目类型代码：
          <el-input placeholder="请输入项目类型代码" style="width: 200px;" v-model="typeInfo.typeCode">
          </el-input>
        </el-form-item>
        <el-form-item>
          项目类型名称：
          <el-input placeholder="请输入项目类型名称" style="width: 200px;" v-model="typeInfo.typeName">
          </el-input>
        </el-form-item>
      </el-form>
    </el-card>
    <div align="center">
      <el-button type="dark" style="margin: 10px;" icon="el-icon-edit" @click="submit" plain>提交</el-button>
      <el-button type="dark" style="margin: 10px;" icon="el-icon-edit" @click="close" plain>取消</el-button>
    </div>
  </el-drawer>
</template>

<script>
import {save} from '@/api/type'

export default {
  props: {
    drawer: Boolean,
    typeInfo: {
      type: Object,
      default: () => {
        return {
          id: null,
          typeName: null,
          typeCode: null
        }
      }
    }
  },
  /*watch: {
    "drawer": function (v) {
      console.info(v)
    }
  },*/
  methods: {
    close() {
      this.$emit("close", false)
    },
    submit() {
      save(this.typeInfo).then(() => {
        this.close()
        this.$notify({
          title: '成功',
          message: '保存成功',
          type: 'success'
        });
      }).catch(() => {
        this.close()
        this.$notify.error({
          title: '错误',
          message: '保存失败'
        })
      })
    }
  }
}
</script>

<style scoped>

</style>
